<!--
 * @Author: albert shyttsyj@126.com
 * @Date: 2024-05-15 20:42:03
 * @LastEditors: albert shyttsyj@126.com
 * @LastEditTime: 2024-06-06 22:46:57
 * @FilePath: /sales-assistant-admin/src/list-demo.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
  <div class="list-page--wrap">
    <el-form
      size="small"
      v-show="showSearch"
      labelPosition="top"
      class="list-page__search">
      <!-- 筛选项item -->
    </el-form>

    <!-- 操作工具栏 -->
    <el-row :gutter="10" class="list-page__tool">
      <!-- 工具栏item -->
    </el-row>

    <!-- 列表 -->
    <el-table height="100%" :data="list" border>
      <!-- 列表项item，例如下面的 数据显示带 show-overflow-tooltip  操作类不带 -->
      <el-table-column
        show-overflow-tooltip
        label="客户编号"
        align="center"
        prop="customerId"
        fixed="left"
        width="130px" />
      <el-table-column
        show-overflow-tooltip
        label="创建人"
        align="center"
        prop="creator" />

      <!-- 操作类 -->
      <el-table-column label="操作" align="center" fixed="right" width="160px">
        <template v-slot="{ row }">
          <el-tooltip v-hasPermi="['member:sa-customer:query']" content="详情">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-document"
              @click="details(row)" />
          </el-tooltip>
          <el-tooltip v-hasPermi="['member:sa-customer:update']" content="编辑">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-edit"
              @click="handleUpdate(row)" />
          </el-tooltip>
          <el-tooltip v-hasPermi="['member:sa-customer:delete']" content="删除">
            <el-button
              size="mini"
              type="text"
              icon="el-icon-delete"
              @click="handleDelete(row)" />
          </el-tooltip>
        </template>
      </el-table-column>
    </el-table>

    <!-- 分页组件 -->
    <pagination />
  </div>
</template>
<script>
export default {
  name: 'listDemo',
  components: {},

  data() {
    return {
      // 遮罩层
      loading: true,
      // 显示搜索条件
      showSearch: true,
      // 总条数
      total: 0,
      // Sacustomer列表
      list: [{ customerId: '1', creator: 'albert' }]
    }
  },
  methods: {}
}
</script>

<style lang="scss"></style>
